import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { visualizer } from "rollup-plugin-visualizer";
import path from "path";
import { loadEnv } from 'vite'
// import { viteMockServe } from "vite-plugin-mock";
// https://vitejs.dev/config/
export default (opt) => {
  const { mode } = opt;
  const APPENV = loadEnv(mode, process.cwd());

  console.log('APPENV:', APPENV);

  return defineConfig(
    {
      plugins: [
        vue(),
        
        // 代码分割 分析插件
        visualizer({
          open:true,  //注意这里要设置为true，否则无效
          filename: "stats.html", //分析图生成的文件名
          gzipSize: true, // 收集 gzip 大小并将其显示
          brotliSize: true, // 收集 brotli 大小并将其显示
        })

        // 配置mock
        // viteMockServe({
        //   mockPath: "./src/mock",
        //   localEnabled: true,
        // })
      ],
      base: "/",
      resolve: {
        alias: {
          //这里猜测应该是一个map，key为别名，value为你要别名的路径
          "@": path.resolve(__dirname, "src"),
        },
      },
      server: {
        host: '127.0.0.1', // 默认是 localhost
        port: 3000, // 默认是 3000 端口
        open: true, // 浏览器自动打开
        https: false, // 是否开启 https
        proxy: { // 本地开发环境通过代理实现跨域，生产环境使用 nginx 转发
          '/api': {
            target: 'http://127.0.0.1:8010', // 后端服务实际地址
            changeOrigin: true,
            rewrite: path => path.replace(/^\/api/, '')
          }
        }
      },


      build: {
        // minify: false,
        //可以配置是否关闭css code split
        // cssCodeSplit: false,
    
        // 自动注入一个模块与加载器的polyfill
        // modulePreload: {
        //   polyfill:true
        // },
    
        rollupOptions: {
          output: {
            chunkFileNames: 'assets/[name].[hash].js',
            entryFileNames: 'assets/[name].[hash].js',
            assetFileNames: 'assets/[ext]/[name].[hash].[ext]',
            manualChunks: function(id){//id是文件名称(全路径)

              // // 如果文件名称(全路径)包含node_modules/vue或node_modules/vue-router则打包在vender.js中
              // if(!id.includes('node_modules')){
              //   console.log("======= package id: ", id);
              // }
              
              
              // if (id.includes('node_modules/vue') || id.includes('node_modules/vue-router')) {
              //   return 'vender';
              // }
              // if (id.includes('node_modules/axios')) {
              //   return 'axios';
              // }
              // if (id.includes('node_modules/ant-design-vue')) {
              //   return 'myAntdv';
              // }
              // if (id.includes('node_modules/echarts')) {
              //   return 'myEcharts';
              // }
              
              // // 该包单独打包 js报错
              // // if (id.includes('node_modules/')) {
              // //   return 'myMoudlesOther'; 
              // // }
            
              // if (id.includes('src/views/')) {
              //   return 'myView';
              // }
              // if (id.includes('src/utils/')) {
              //   return 'myUtils'; 
              // }
              // if (id.includes('src/api/')) {
              //   return 'myApi';
              // }
              // if (id.includes('src/hooks/')) {
              //   return 'myHooks'; 
              // }

              // // 该包单独打包 js报错
              // // if (id.includes('src/router/')) {
              // //   return 'myRouter'; 
              // // }
              // if (id.includes('src/')) {
              //   return 'mySrcOther'; 
              // }
              // // return 'myDefault';
            }


            // manualChunks: {
            //   'vender': ['vue', 'vue-router'],
            //   'antdv': ['ant-design-vue'],
            //   'echarts': ['echarts'],
            //   'lodash-es': ['lodash-es'],
            // }
          }
        }
      }



    })
}
